<template>
  <div class="webFile">
    <h1 style="margin-top: 3%">请输入可访问的FileUrl地址</h1>
    <div style="margin: 30px 0;"/>
    <a-textarea placeholder="请输入备注" v-model="textarea"/>
    <div style="margin: 40px 0;"/>
    <br>
    <a-button type="primary" @click="clClean" style="margin-right:10px;">clean</a-button>
    <a-button type="primary" @click="clSubmit">view</a-button>
    <a-dropdown style="margin-right: 10px;margin-top:10px;">
      <a-button style="margin-left: 8px"> 新建
        <a-icon type="plus"/>
      </a-button>
      <a-menu slot="overlay">
        <a-menu-item key="1" icon="plus" @click="createFile('word')">文字文档</a-menu-item>
      </a-menu>
    </a-dropdown>
  </div>
</template>

<script>
  import { fileSuffix } from '@/components/wps/util/common-data'
  import { getAction } from '@/api/manage'
  import Vue from 'vue'
  import { ACCESS_TOKEN } from '@/store/mutation-types'

  export default {
    name: 'webFile',
    data() {
      return {
        loading: false,
        textarea: '',
        watchClosed: '',
        url: {
          getViewUrlWebPath: '/eoa/wps/oaWpsFile/getViewUrlWebPath'
        }
      }
    },
    methods: {
      clClean() {
        this.textarea = ''
        this.console.success('cleaned textarea value')
      },
      clSubmit() {
        this.getViewUrlWebPath()
      },
      getViewUrlWebPath() {
        if (!this.textarea) {
          this.$message.warning('输入内容不能为空！')
          return
        } else {
          let reg = /^((https|http|ftp|rtsp|mms)?:\/\/)[^\s]+/
          if (!(reg.test(this.textarea))) {
            this.$message.warning('请输入正确的file url！')
            return
          }
          const fileName = this.textarea
          const fileStrArr = fileName.split('.')
          const suffix = fileStrArr[fileStrArr.length - 1]

          let result = fileSuffix.some((item) => {
            return item === suffix
          })

          if (!result) {
            this.showErrMeg('不支持该文件类型')
            return
          }
        }
        this.loading = true
        const params = {
          fileUrl: this.textarea
        }
        getAction(this.url.getViewUrlWebPath, params).then((res) => {
          if (res.success) {
            console.log(res)
            sessionStorage.wpsUrl = res.result.wpsUrl
            sessionStorage.token = res.result.token
            // const token = Vue.ls.get(ACCESS_TOKEN);

            // 跳转 使用sessionStorage，避免关键信息在ip中暴露
            // 使用push会停留当前页面，故不采纳
            // params 传递参数，子组件无法渲染iframe组件，故不采纳
            // sessionStorage.wpsUrl = r;
            // sessionStorage.token = token;
            let routeUrl = this.$router.resolve({
              path: '/modules/eoa/wps/viewFile'
            })
            window.open(routeUrl.href, '_blank')
          } else {
            this.$message.warning('请求错误！')
          }
          this.loading = false
        }).catch(() => {
          this.$message.warning('请求错误！')
          this.loading = false
        })
      },
      createFile(template) {
        sessionStorage.createFileUrlType = template
        let routeUrl = this.$router.resolve({
          path: '/modules/eoa/wps/createFile'
        })
        this.watchClosed = window.open(routeUrl.href, '_blank')
      }
    }
  }
</script>

<style scoped>
  .cl-textarea {
    width: 55%;
    height: 40%;
  }
</style>
